<template>
  <div class="container-table" style="margin-bottom: 16px">
    <div class="item item-layout">
      <div class="label-item required">提单号</div>
      <div class="content-item">{{ detailData.blno }}</div>
    </div>
    <div class="item item-layout">
      <div class="label-item">BOOKING</div>
      <div class="content-item">
        {{ detailData.bookingNo }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item">合约号</div>
      <div class="content-item">
        {{ detailData.contractNumber }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item">船代</div>
      <div class="content-item">
        {{ detailData.shipingAgent }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item required">船名</div>
      <div class="content-item">{{ detailData.vessel }}</div>
    </div>
    <div class="item item-layout">
      <div class="label-item required">航次</div>
      <div class="content-item">{{ detailData.voyage }}</div>
    </div>
    <div class="item item-layout">
      <div class="label-item">靠泊码头</div>
      <div class="content-item">
        {{ detailData.berthWharf }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item">进港代码</div>
      <div class="content-item">
        {{ detailData.enterPortCode }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item required">开航日期</div>
      <div class="content-item">
        {{
          detailData.atd
            ? $utils.formatDateTime(detailData.atd, 'YYYY-MM-DD')
            : ''
        }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item">截港时间</div>
      <div class="content-item">
        {{
          detailData.deadlinePortTime
            ? $utils.formatDateTime(
                detailData.deadlinePortTime,
                'YYYY-MM-DD HH:mm'
              )
            : ''
        }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item">截关时间</div>
      <div class="content-item">
        {{
          detailData.deadlineCustomsTime
            ? $utils.formatDateTime(
                detailData.deadlineCustomsTime,
                'YYYY-MM-DD HH:mm'
              )
            : ''
        }}
      </div>
    </div>
    <div class="item item-layout">
      <div class="label-item">截单时间</div>
      <div class="content-item">
        {{
          detailData.deadlineOrderTime
            ? $utils.formatDateTime(
                detailData.deadlineOrderTime,
                'YYYY-MM-DD HH:mm'
              )
            : ''
        }}
      </div>
    </div>
  </div>
</template>

<script setup>
import { computed, defineComponent, nextTick, reactive, ref } from 'vue'
import AppSearchForm from '@/components/AppSearchForm.vue'
import AppPageTable, { useTableOption } from '@/components/AppPageTable2'
import dayjs from 'dayjs'
import { ElMessage } from 'element-plus'
import { useRouter, useRoute } from 'vue-router'
import { useStore, Store } from 'vuex'
import request from '@/public/request'
import selectDown from '../newBusiness/selectDownNew.vue'
import vueBus from '@/utils/vueBus'
import docSelects from './../components/docSelects.vue'
import docDetailFillShipperNew from './docDetailFillShipperNew.vue'
import { validateOnlyNumberTwo, validateNumber } from '@/utils/validate.js'

//判断当前打开的是否是业务列表
const props = defineProps({
  detailData: {
    type: Object,
    defalut: () => {}
  }
})

// 弹框的form表单
const addFormRef = ref(null)
const BLDialog = ref(null)

const state = reactive({
  show: false,
  showCheck: false,
  cargonList: [],
  showCold: false,
  showDranger: false,
  showOog: false,
  secondeShow: false
})

const Router = useRouter()
const Route = useRoute()
const store = useStore()
</script>

<style lang="scss" scoped>
@import '@/styles/business/business.scss';
</style>
